<template>
	<z-nav-bar title="评测"></z-nav-bar>
	<view class="cp-top flex_sb">
		<view class="cp-top-list" @click="tabSwitch(1)">
			<view class="cp-top-tit">基础测评未测</view>
			<view class="cp-top-num flex_fs">
				<text>{{ headData[0] }}</text>
				<text class="cp-top-num-unit">/待测人</text>
			</view>
			<!-- <view class="cp-top-status">未完成</view> -->
		</view>
		<view class="cp-top-list body-cp" @click="tabSwitch(2)">
			<view class="cp-top-tit">身体测评未测</view>
			<view class="cp-top-num flex_fs">
				<text>{{ headData[1] }}</text>
				<text class="cp-top-num-unit">/待测人</text>
			</view>
			<!-- <view class="cp-top-status">未完成</view> -->
		</view>
		<view class="cp-top-list sz-cp" @click="tabSwitch(3)">
			<view class="cp-top-tit">实战测评未测</view>
			<view class="cp-top-num flex_fs">
				<text>{{ headData[2] }}</text>
				<text class="cp-top-num-unit">/待测人</text>
			</view>
			<!-- <view class="cp-top-status">未完成</view> -->
		</view>
	</view>
	<view class="cp-ht">&nbsp;</view>
	<!--学员提问-->
	<view class="cp-bt">
		<view class="cp-bt-tit">测评学员{{ stu.type ? '-' + textList[stu.type] : '' }}</view>
		<view class="cp-search flex_fsc">
			<uni-icons type="search" size="16" class="uni-mr-16"></uni-icons>
			<input
				v-model="stu.name"
				type="text"
				placeholder="搜索学员名称"
				placeholder-class="uni-placeholder"
				confirm-type="search"
				@confirm="searchList"
			/>
		</view>
		<view v-if="stu.list && stu.list.length" class="cp-con">
			<view
				v-for="item in stu.list"
				:key="item.id"
				class="cp-con-list flex_fsc"
				hover-class="none"
				@click="evaluationIndex(item)"
			>
				<image :src="setting.oss_pub_domain + item.avatar" class="user-head"></image>
				<view class="cp-con-center">
					<view class="cp-con-center-tit">{{ item.name }}</view>
					<view class="cp-con-center-con flex_fsc">
						<view class="flex_fsc" :class="{ 'cp-notg': !item.evalBaseDone }">
							基础测评
							<image
								:src="`${setting.oss_pub_domain}/app-img/icon/cp-${!item.evalBaseDone ? 'no' : ''}tg.png`"
							></image>
						</view>
						<view class="flex_fsc" :class="{ 'cp-notg': !item.evalBodyDone }">
							身体测评
							<image
								:src="`${setting.oss_pub_domain}/app-img/icon/cp-${!item.evalBodyDone ? 'no' : ''}tg.png`"
							></image>
						</view>
					</view>
				</view>
				<image :src="setting.oss_pub_domain + '/app-img/icon/more.png'" class="cp-con-more"></image>
			</view>
		</view>
		<z-no-data v-else width="400" placeholder="暂无学员"></z-no-data>
	</view>
</template>

<script setup>
import { ref, reactive } from 'vue';
import { onPullDownRefresh, onReachBottom } from '@dcloudio/uni-app';
import { getPlayerDetial, getEvaluationIndexHead, getEvaluationStuList } from '@/api/player.js';

const headData = ref([0, 0, 0]),
	textList = ['', '基础测评', '身体测评', '实战测评'];
getEvaluationIndexHead().then((res) => {
	headData.value = res;
});
const stu = reactive({
	pageNum: 1,
	total: 0,
	list: [],
	name: '',
	type: ''
});
fetchList();
function fetchList() {
	const parma = { pageNum: stu.pageNum, pageSize: 10, type: stu.type };
	if (stu.name) parma.name = stu.name;
	getEvaluationStuList(parma).then((res) => {
		if (stu.pageNum === 1) stu.list = res.rows;
		else stu.list.push(...res.rows);
		stu.total = res.total;
		uni.stopPullDownRefresh();
	});
}

function tabSwitch(type) {
	stu.type = type;
	stu.pageNum = 1;
	stu.name = '';
	fetchList();
}

onPullDownRefresh(() => {
	stu.pageNum = 1;
	stu.name = '';
	fetchList();
});

onReachBottom(() => {
	if (stu.list.length >= stu.total) return;
	stu.pageNum += 1;
	fetchList();
});

function searchList() {
	stu.pageNum = 1;
	fetchList();
}

function evaluationIndex(item) {
	getPlayerDetial(item.id).then((res) => {
		uni.setStorageSync('player-info', res);
		uni.navigateTo({
			url: '/pages/player/evaluation/student-cpdetail/student-cpdetail'
		});
	});
}
</script>

<style lang="scss">
@import 'evaluation.scss';
</style>